<template>
	<view class="page">
		<view class="content">
			<view class="top flex align-center">
				<view class="name text-333 text-bold fu-fs28 flex1">金币数量</view>
				<view style="width: 110rpx;"></view>
				<view class="name text-333 text-bold fu-fs28 flex1">积分数量</view>
			</view>
			<view class="solid-bottom flex align-center">
				<view class="ipt-box flex align-center flex1">
					<image src="https://localelife.chunchuangkeji.cn/h5img/images/028.png" class="jb-icon flex-shrink"></image>
					<input placeholder="请输入金币数量" type="number" placeholder-style="color: #BFBFBF" class="ipt" v-model="money" @input="handleInput" />
				</view>
				<view class="text-center" style="width: 110rpx;height: 28rpx;">
					<image src="https://localelife.chunchuangkeji.cn/h5img/images/change.png" class="change flex-shrink"></image>
				</view>
				<view class="ipt-box flex align-center flex1">
					<image src="https://localelife.chunchuangkeji.cn/h5img/images/029.png" class="jf-icon flex-shrink"></image>
					<input placeholder="转换积分数量" placeholder-style="color: #BFBFBF" class="ipt" v-model="score_num" disabled />
				</view>
			</view>
		</view>
		<view class="btn" @click="submit">确定</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			money: '',
			score_num: '',
			isCheck: false
		}
	},
	onLoad() {
		
	},
	methods: {
		handleInput() {
			this.getScoreNum()
		},
		getScoreNum() {
			this.$api.post(global.apiUrls.post640e889e84148, {
				money_num: this.money
			}).then(res => {
				if (res.data.code == 1) {
					this.score_num = res.data.data
				} else {
					this.score_num = 0
				}
			})
		},
		submit() {
			if (this.isCheck) return;
			if (!this.money) {
				this.$message.info('请输入金币数量')
				return
			}
			this.isCheck = true
			this.$api.post(global.apiUrls.post640e8b70318f8, {
				money_num: this.money
			}).then(res => {
				if (res.data.code == 1) {
					this.$message.info('转换成功')
					setTimeout(() => {
						uni.navigateBack()
					}, 800)
				} else {
					this.$message.info(res.data.msg)
				}
				setTimeout(() => {
					this.isCheck = false
				}, 800)
			}).catch(() => {
				this.isCheck = false
			})
		}
	}
}
</script>

<style lang="scss" scoped>
	page {
		background-color: #fff;
	}
	.solid-bottom {
		border-bottom: 1rpx solid #eee;
	}
	.page {
		overflow: hidden;
		min-height: 100vh;
		background-color: #fff;
		.content {
			padding: 0 32rpx;
			overflow: hidden;
			.top {
				margin-top: 40rpx;
			}
			.ipt-box {
				padding: 32rpx 0 24rpx;
				.jb-icon {
					width: 26rpx;
					height: 28rpx;
					margin-right: 16rpx;
				}
				.jf-icon {
					width: 32rpx;
					height: 28.9rpx;
					margin-right: 16rpx;
				}
			}
			.change {
				width: 30rpx;
				height: 28rpx;
			}
		}
		.btn {
			background-color: #FF6F27;
			height: 88rpx;
			border-radius: 44rpx;
			text-align: center;
			line-height: 88rpx;
			position: fixed;
			bottom: 60rpx;
			font-size: 32rpx;
			color: #F6F7F9;
			font-weight: bold;
			width: 686rpx;
			left: 0;
			right: 0;
			margin: 0 auto;
		}
	}
</style>
